<template >
  <el-container>
    <el-aside
      width="200px"
      style="background-color: rgb(238, 241, 246)"
    >
      <div class="iconlogo iconfont">&#xe600;</div>
      <el-menu
        default-active="1-4-1"
        class="el-menu-vertical-demo"
        @open="handleOpen"
        @close="handleClose"
        :collapse="isCollapse"
        router
      >
        <el-menu-item index="1">
          <i class="iconfont">&#xe6ae;</i>
          <span slot="title">系统管理</span>
        </el-menu-item>
        <el-menu-item index="2">
          <i class="iconfont">&#xe7d3;</i>
          <span slot="title">基础数据</span>
        </el-menu-item>
        <el-submenu index="3">
          <template slot="title">
            <i class="iconfont">&#xe615;</i>
            <span slot="title">产品工艺文件管理</span>
          </template>
          <el-menu-item-group>
            <el-menu-item index="/basics">
              工艺文件基础信息
            </el-menu-item>
            <el-menu-item index="3-1">任务性质管理</el-menu-item>
            <el-menu-item index="3-2">部件管理</el-menu-item>
            <el-menu-item index="3-3">工艺文件类别管理</el-menu-item>
            <el-menu-item index="3-4">工艺文件条码打印</el-menu-item>
            <el-menu-item index="3-5">导入发放任务</el-menu-item>
          </el-menu-item-group>
          <el-menu-item-group>
            <el-menu-item index="3-6">发放任务列表</el-menu-item>
          </el-menu-item-group>
          <el-menu-item-group>
            <el-menu-item index="3-7">发放任务汇总查询</el-menu-item>
            <el-menu-item index="3-8">工艺文件汇总查询</el-menu-item>
          </el-menu-item-group>
        </el-submenu>
        <el-menu-item index="4">
          <i class="iconfont">&#xe689;</i>
          <span slot="title">管藏技术资料管理</span>
        </el-menu-item>
        <el-menu-item index="5">
          <i class="iconfont">&#xe6d5;</i>
          <span slot="title">电子图文归档管理</span>
        </el-menu-item>
        <el-menu-item index="6">
          <i class="iconfont">&#xe62e;</i>
          <span slot="title">关键台账</span>
        </el-menu-item>
        <el-menu-item index="7">
          <i class="iconfont">&#xe68a;</i>
          <span slot="title">流程管理</span>
        </el-menu-item>
      </el-menu>
    </el-aside>

    <div class="el-header-div">
      <div class="el-headers">
        <el-input
          class="elinput iconfont"
          prefix-icon="icon-sousuo4"
          placeholder="请输入内容"
        ></el-input>
        <div class="div-accountnumber">
          <div class="div-border-add iconfont">&#xe6d0;</div>
          <div class="div-profile-user">
            <el-avatar icon="el-icon-user-solid"></el-avatar>
          </div>
          <div class="iconfont div-tuichu">&#xe602;</div>
        </div>
        <div class="div-message iconfont">&#xe604;</div>
        <div class="div-Home iconfont">&#xe62f;</div>
      </div>
      <div class="el-headerss">
        <div class="el-headerss-dhtitle">工艺文件基础信息</div>
        <div class="iconfont el-headerss-import">&#xeb49;<span style="font-size:16px">导入</span></div>
        <div class="iconfont el-headerss-add">&#xe6d0;<span style="font-size:16px">新增信息</span></div>
      </div>
      <div class="tableview">
        <keep-alive>
          <router-view />
        </keep-alive>
      </div>
    </div>
  </el-container>
</template>

<script>
import '../assets/icon/iconfont.css'
export default {
  data () {
    return {

    }
  }
}
</script>
<style>
.div-tuichu {
  display: inline;
  line-height: 50px;
}
::-webkit-scrollbar {
  display: none;
}
.div-profile-user {
  display: inline;
  line-height: 50px;
}
.el-headers .div-border-add {
  color: white;
  display: inline;
  width: 40px;
  height: 40px;
  line-height: 50px;
  border-radius: 90px;
  background: rgb(10, 10, 10);
}
.tableview {
  margin: 5px;
}
.el-header-div {
  width: 100%;
  background: rgb(237, 237, 247);
}
.el-headers .elinput {
  width: 200px;
  line-height: 50px;
}
.el-headers .div-accountnumber {
  height: 50px;
  width: 150px;
  background: rgb(86, 86, 230);
  display: inline;
  float: right;
  padding-right: 10px;
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
}
.el-headers .div-Home {
  display: inline;
  float: right;
  line-height: 50px;
  padding-right: 20px;
  cursor: pointer;
}
.el-headers .div-message {
  display: inline;
  float: right;
  line-height: 50px;
  padding-right: 30px;
  cursor: pointer;
}

/* .qwe el-input {
  border: 0;
} */
.el-headers {
  height: 50px;
  width: 100%;
  border-bottom: 1px solid #eee;
  background: white;
}
.el-headerss {
  height: 35px;
  width: 100%;
  line-height: 25px;
  background: white;
}
.el-header {
  background-color: #b3c0d1;
  color: #333;
  line-height: 60px;
}

.el-aside {
  color: #333;
}
.iconlogo {
  background: white;
  text-align: center;
  font-size: 60px;
}
.el-headerss .el-headerss-dhtitle {
  display: inline;
  line-height: 35px;
  padding-left: 20px;
}
.el-headerss .el-headerss-add {
  display: inline;
  float: right;
  padding-right: 30px;
  line-height: 35px;
}
.el-headerss .el-headerss-import {
  display: inline;
  float: right;
  padding-right: 20px;
  line-height: 35px;
}
</style>
